<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%String msg=(String)request.getAttribute("msg"); %>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
	<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
	<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no" />
	<meta name="author" content="mironcoder" />
	<meta name="email" content="mironcoder@gmail.com" />
	<meta name="profile" content="https://themeforest.net/user/mironcoder" />
	<meta name="template" content="Organe" />
	<meta name="title" content="Organe - Organic Food HTML Template" />
	<meta name="keywords" content="organe, organic, food, shop, ecommerce, store, html, agriculture, vegetable, organic food, organic product, organic farm, organic life, organic shop, food store" />
	<title>Organe - Login</title>
	<link rel="icon" href="images/favicon.png" />
	<link rel="stylesheet" href="static/css/bootstrap.min.css" />
	<link rel="stylesheet" href="static/css/main.css" />
	<link rel="stylesheet" href="static/css/user-form.css" />
</head>
 <body>
 <%
		String ch = "";
		Cookie []c = request.getCookies();
		if(c != null && c.length > 0){
			for(int i = 0;i < c.length;i++){
				if("user".equals(c[i].getName())){
					
				}
				if("pass".equals(c[i].getName())){
					ch = "checked";
				}
			}
		}
	%>
  <section class="user-form-part">
   <div class="container">
    <div class="row justify-content-center">
     <div class="col-12 col-sm-10 col-md-8 col-lg-6 col-xl-5">
      <div class="user-form-logo">
       <a href="index.html"><img src="static/picture/logo.png" alt="logo" /></a>
      </div>
      <div class="user-form-card" style="height: 550px">
       <div class="user-form-title">
        <h2>welcome!</h2>
        <p>Use your credentials to access</p>
       </div>
       <form class="user-form" action="UserServlet" method="post">
       <input type="hidden" name="flag" value="login"/>
        <div class="form-group">
         <input type="text" class="form-control" id="user" name="user" placeholder="请输入用户名" onkeyup="findUsernull()"/>
         <span id="u"></span>
        </div>
        <div class="form-group">
         <input type="password" class="form-control" id="pass" name="pass" placeholder="请输入密码" onkeyup="findPassnull()" />
          <span id="p"></span>
        </div>
        <div class="form-group">
         <input type="text" class="form-control" name="code" placeholder="请输入验证码"  />
        </div>
        <div class="form-group">
        <img src="ImgServlet" onclick="yzm(this)"/>
        </div>
        <div class="form-group">
        七天免登录：<input type="checkbox" name="rm" value="1" id="check"
			<%if("checked".equals(ch)){ %>
				checked
			<%} %>
		/>
        </div>
        <div class="form-button" style="clear: both;">
        <%if(msg!=null){ %>
         <p style="color: red"><%=msg%></p>
         <%} %>
         <button type="submit">登录</button>
         <p>没有账户？<a href="register.jsp">请注册</a></p>
        </div>
       </form>
      </div>
      <div class="user-form-footer">
       <p>Organe | &copy; Copyright by <a href="#">Mironcoder</a></p>
      </div>
     </div>
    </div>
   </div>
  </section>
  <script src="static/js/jquery-1.12.4.min.js"></script>
  <script src="static/js/popper.min.js"></script>
  <script src="static/js/bootstrap.min.js"></script>
 <script type="text/javascript">
 function findPassnull(){
	 if($("pass").val()==null&&$("#pass").val()==""){
			$("#p").text("密码不能为空");
			$("#p").css("color","red");
	}else{
		$("#p").text("");
	}
 }
 function findUsernull(){
	 if($("user").val()==null&&$("#user").val()==""){
			$("#u").text("用户名不能为空");
			$("#u").css("color","red");
	}else{
		$("#u").text("");
	}
 }
 function yzm(element){
		//加上随机数据的目的是为了避免因为缓存原因，导致路径相同而刷新不出的问题
		element.src = "ImgServlet?r="+Math.random();
	}
 $(function(){
		if($("#check").prop("checked")){
			window.location.href="index.jsp";
		}
	});
</script>
 </body>
</html>